<template>
  <el-input :type="type" :placeholder="$t(placeholder)">
    <template #prepend v-if="prepend">
      <template v-if="typeof prepend === 'object'">
        <Component :is="prepend" />
      </template>
      <span v-else>{{ prepend }}</span>
    </template>
    <template #append v-if="append">
      <template v-if="typeof append === 'object'">
        <Component :is="append" />
      </template>
      <span v-else>{{ append }}</span>
    </template>
  </el-input>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'

const props = withDefaults(
  defineProps<{
    type?: string
    placeholder?: string
    // value 必须过滤，会冲突
    value?: string
    i18n?: boolean
    i18nPrefix?: string

    prepend?: string | Component
    append?: string | Component
  }>(),
  {
    // placeholder: ''
  }
)

const { t } = useI18n()
const $t = (text?: string) => {
  return props.i18n && text
    ? t((props.i18nPrefix ? props.i18nPrefix + '.' : '') + text)
    : text != void 0
    ? text
    : t('component.zform.placeholder.input')
}
</script>

<style lang="scss"></style>
